<div id="SinTab">
<div class="panes">

    <table id="TabTable" width="100%">
        <caption><?php echo "Marcas del empleado: ". $nombre ?></caption>
        <thead>
            <tr>
                <th scope="col">Usuario</th>
                <th scope="col">Estado</th>
                <th scope="col">Fecha y hora</th>
            </tr>
        </thead>
        <tfoot>
            <tr>
                <th colspan="4"><?php echo "Total: ". $total." marcas" ?></th>
                
            </tr>
        </tfoot>
        <tbody>
            <?php
            if ($marcas <> NULL) {
                foreach ($marcas->result() as $record):
                    echo "<tr>";
                    echo "<td>";
                    echo $record->usuario;
                    echo "</td>";
                    echo "<td>";
                    switch ($record->estado) {
                    case 1: echo "A Tiempo"; break;
                    case 2: echo "Tardía sin aprobar"; break;
                    case 3: echo "Ausencia sin aprobar"; break;
                    case 4: echo "Tardía aprobada"; break;
                    case 5: echo "Ausencia aprobada"; break;
                    case 6: echo "Tardía rechazada"; break;
                    case 7: echo "Ausencia rechazada"; break;
                    case 10: echo "Entrado de nuevo"; break;
                    case 20: echo "Salida"; break;
                    default: echo "Marco"; break;
                    }
                    echo "</td>";
                    echo "<td>";
                    echo $record->hora_actual;
                    echo "</td>";
                    echo "</tr>";
                endforeach;
            }else
                echo "<h4>No tiene</h4>";
            ?>
        </tbody>
    </table>
    <br/>

</div>
<div class="pagination">
    <?php
    echo $paginacion;
    ?>
</div>
</div>


<script>
    $(document).ready(function(){
        applyPagination();
        function applyPagination() {
            $("div.pagination a").click(function() { 
                
                var name = $("#search").val();
                strDate1 = $('#desde1').val();
                strDate2 = $('#hasta1').val();
                var msj = '';
                if(!name){
                    alert('Ingrese una cedula o un nombre');
                    return false;
                }
                if(strDate1 == "Seleccione la fecha" || strDate2 == "Seleccione la fecha"){
                    alert('Seleccione un rango de fechas');
                    return false;
                }
                
                var dateParts1 = strDate1.split("/");
                var FechaDesde = new Date(dateParts1[2], dateParts1[1] , dateParts1[0]);
                var desde = FechaDesde.getFullYear()+"-"+FechaDesde.getMonth()+"-"+FechaDesde.getDate();
                //Fecha Hasta
    
                var dateParts2 = strDate2.split("/");
                var FechaHasta = new Date(dateParts2[2], dateParts2[1] , dateParts2[0]);
                var hasta = FechaHasta.getFullYear()+"-"+FechaHasta.getMonth()+"-"+FechaHasta.getDate();
        
                if(FechaDesde > FechaHasta){
                    alert("Error en la fechas, deben tener orden cronológico");
                    return false;
                }
                if(name.indexOf(',') != -1){
                    var nombre = name.substring(0,name.indexOf(','));
                    var aux = name.substring(name.indexOf(',')+2);
                    if(aux != ""){
                        name = aux;
                    }
                }else{
                    msj ="Selecciones el usuario en las sugerencias,\n\para que la busqueda sea más precisa";
                }
                
                var form_data = {
                    nombre: nombre,
                    cedula: name,
                    FdesdeView: strDate1,
                    FhastaView: strDate2,
                    Fdesde: desde,
                    Fhasta: hasta,
                    Tmarca: $("#box").val(),
                    msj: msj,
                    ajax: '1'
                };
                $.ajax({
                    type: "POST",
                    url: $(this).attr('href'),
                    data: form_data,
                    beforeSend: function() {
                        $("#info_usuario").html("");
                    },
                    success: function(msg){
                        $('#info_usuario').html(msg);
                        //applyPagination();
                    }
                });               
                return false;
            });            
        }
    });
</script>